/<template>
  <div>
    <template v-for="item in tree_data">
        <el-submenu
         :key="item._id"
         :index="item._id"
         v-if="item.children && item.children.length > 0 && item.menuType === '1'"
         >
            <template slot="title">
                <i class="el-icon-location"></i>
                <span>{{item.menuName}}</span>
                <TreeMenu :tree_data = "item.children"/>
            </template>
        </el-submenu>
            
        <el-menu-item 
            :key="item._id+1"
            :index="item.path"
            v-else-if="item.menuType === '1'"
            > 
            <i class="el-icon-menu"></i>
            <span slot="title">{{item.menuName}}</span>
        </el-menu-item>
        
    </template>
   
     <!-- 带下拉箭头
     <el-submenu index="1">
        <template slot="title">
            <i class="el-icon-location"></i>
            <span>导航一</span>
        </template>
        <el-menu-item-group>
            <template slot="title">分组一</template>
            <el-menu-item index="1-1">选项1</el-menu-item>
            <el-menu-item index="1-2">选项2</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="分组2">
            <el-menu-item index="1-3">选项3</el-menu-item>
        </el-menu-item-group>
        <el-submenu index="1-4">
            <template slot="title">选项4</template>
            <el-menu-item index="1-4-1">选项1</el-menu-item>
        </el-submenu>
    </el-submenu> -->
    <!-- 不带直接跳转 -->
    <!-- <el-menu-item index="2">
        <i class="el-icon-menu"></i>
        <span slot="title">导航二</span>
    </el-menu-item> -->
    <!-- {{tree_data}} -->
  </div>
</template>

<script>
export default {
    name:"TreeMenu",
    props: {
        tree_data:Array,
        default:()=>{
            return []
        }
    },
    beforeUpdate:()=>{
        console.log(tree_data);
    }
}
</script>

<style>

</style>